<template>
	<view>
		
	
		<view class="cardItem" >
			<view class="title mdTitle Han">
	           {{job.name}}
			</view>
			<view class="msg Han mdText">
				<text>{{job.address}}</text>
				<text v-if="job.isList">已上市</text>
				<text>{{job.numRange}}人</text>
			</view>
			
			<view class="tags mdText Han">
				<view class="tag" v-for="tag in job.tag">
					{{tag}}
				</view>
			</view>
			
			<view class="hr">
				<image :src="job.photo" mode=""></image>
				<text class="md2Text">{{job.unit}}</text>
			</view>
			
			<text class="salary mdTitle Han">
				{{job.salary}}K
			</text>
			
			<!-- 分割线 -->
			<view class="line">
				
			</view>
			
			<!-- 时间 -->
			<view class="editLine">
				<text class="Han md2Text">{{chatTips}}</text>
				<!-- <button type="default" class="cancel md6Text" @click="cancelCollect(job,jobIndex)">取消收藏</button> -->
			</view>
		</view>
</view>	
	
</template>

<script>
	export default{
		data(){
			return {
				time:'2021年12月01日 12：32',
				job:
				{
			name:'高级UI设计师',
			address:'安徽广雅',
			isList:true,
			numRange:'50-100',
			salary:'12-16',
			position:'上海黄埔',
			photo:require('../../../static/imgs/hr1.gif'),
			hr:'高女士·人事主管',
			unit:'威斯特信息科技有限公司',
			tag:['视觉设计','学历不限','经验不限','交互体验']
			},
			
			}
			
		},
		props:{
			chatTips:{
				type:String
			}
		},
		
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {
		
		},
		
		methods:{
			// 取消收藏
			cancelCollect(item,index){
				this.jobList.splice(index,1);
				uni.showToast({
					title:'取消成功',
					duration:2000
				})
			}
		}
	}
</script>

<style scoped lang="less">
	
	
	
		.cardItem {
			width: 100%;
			// height: 370upx;
			background-color: #fff;
			margin: 10upx auto;
			padding:0 32upx;
			position: relative;
			padding-bottom: 18upx;
			
		.title{
			color: #333;
			font-weight: bold;
			
			padding-top: 28upx;
		}
		
		.msg{
			padding-top: 20upx;
			color: #999999;
			
			text{
				padding-right: 30upx;
			}
		}
		
		.tags{
			display: flex;
			margin-top: 24upx;
			.tag{
				// width: 104upx;
				padding: 0 10upx;
				height: 42upx;
				line-height: 42upx;
				text-align: center;
				background-color: #F3FAFF;
				margin-right: 20upx;
			}
		}
		
		.hr{margin-top: 18upx;
			image{
				width: 72upx;
				height: 72upx;
				vertical-align: middle;
				margin-right: 10upx;
			}
		}
		
		.salary{
			position: absolute;
			color: #00aaef;
			top: 28upx;
			right: 36upx;
		}
		
	 .editLine{
		 display: flex;
		 justify-content: space-between;
		 padding-top: 14upx;
		 text{
			 color: #999999;
		 }
		 
		 .cancel{
			
			 height: 52upx;
			 line-height: 52upx;
			 margin: 0;
			 background-color: #F5F5F5;
		 }
	 }
		}
	
	
</style>
